<template>
<a-locale-provider :locale="locale">
    <div :class="['page-view-layout', device]">
      <RouteView :keepAlive = keepAlive ></RouteView>
    </div>
  </a-locale-provider>
</template>
<script>
// 引入设备判断
import { mixinDevice, AppDeviceEnquire } from '@/mixins/index'
// 引入语言包
// import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
// 引入显示父容器
import RouteView from './RouteView'
export default {
  name: 'PageView',
  components: { RouteView },
  mixins: [
    mixinDevice,
    AppDeviceEnquire
  ]
}
</script>
<style lang="less" scoped>
  .page-view-layout {
    height: 100%;
    &.tv {
       .container {
        .main {
          max-width: 1140px;
          background: red;
        }
      }
    }
    &.desktop {
      .container {
        .main {
          max-width: 960px;
          background: green;
        }
      }
    }
    &.tablet {
      .container {
        .main {
          max-width: 720px;
          background: yellow;
        }
      }
    }
    &.mobile {
      .container {
        .main {
          max-width: 540px;
          background: pink;
        }
      }
    }
  }
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    width: 100%;
    height: 100%;
  }
</style>
